<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- Meta, title, CSS, favicons, etc. -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

<link th:replace="fragments/dependency :: list-css">

<title>优铺Admin</title>
</head>

<body class="nav-md">
	<div class="container body">
		<div class="main_container">
			<!-- Left Menu -->
			<div th:replace="fragments/leftMenu :: leftMenu"></div>

			<!-- top navigation -->
			<div th:replace="fragments/header :: header"></div>


			<!-- page content -->
			<div class="right_col" role="main">
				<div class="ln_solid"></div>
				<div class="col-md-12 col-sm-12 col-xs-12">
					<div class="x_panel">
						<div class="x_title">
							<h2>用户信息</h2>
							<ul class="nav navbar-right panel_toolbox">
								<li><a class="collapse-link">
										<i class="fa fa-chevron-up"></i>
									</a></li>
							</ul>
							<div class="clearfix"></div>
						</div>
						<!-- 按钮区域 -->
						<!-- 搜索区域 -->
						<div class="x_content">
							<div class="form-inline">
								<div class="form-group">
									<label for="ex4">账号：</label> <input type="text" name="account" th:value="${param.account}" class="form-control" placeholder=" ">
								</div>
								
								<div class="form-group">
									<label for="ex4"> 登录设备：</label> <select class="form-control" name="platform" id="platform">
										<option value="">请选择</option>
										<option th:each="state : ${T(com.up.upzl.biz.domain.User.Platform).values()}" th:value="${state}" th:selected="${#strings.isEmpty(param.platform)}?'false': ${param.platform[0]} eq ${state.name()}" th:text="${state}">Option one</option>
									</select>
								</div>
								
								<label for="ex4">登录日期</label>
								<div class='input-group date' id='myDatepicker0'>
									<input type='text' class="form-control" name="beginTime" th:value="${#strings.isEmpty(param.beginTime)}?'': ${param.beginTime[0]}" /> <span class="input-group-addon"> <span class="glyphicon glyphicon-calendar"></span>
									</span>
								</div>
								<label for="ex4">-</label>
								<div class='input-group date' id='myDatepicker1'>
									<input type='text' class="form-control" name="endTime" th:value="${#strings.isEmpty(param.endTime)}?'': ${param.endTime[0]}" /> <span class="input-group-addon"> <span class="glyphicon glyphicon-calendar"></span>
									</span>
								</div>
								
								<div class="x_content">
									<button type="button" class="btn btn-round btn-primary hide" name="query" permission-rel="/user/list">查询</button>
								</div>
								<div class="x_title">
									<div class="clearfix"></div>
								</div>
								<div class="text-right">
									<span class="label label-info" th:text="'总数：'+${pageList.totalElements}"></span>
								</div>
							</div>
						</div>
						
						<div class="x_content">
							<div class="table-responsive">
								<table class="table table-striped jambo_table bulk_action">
									<thead>
										<tr class="headings">
											<th class="column-title">编号</th>
											<th class="column-title">账号</th>
											<th class="column-title">首次登录时间</th>
											<th class="column-title">登录设备</th>
											<th class="column-title">累计登录次数</th>
										</tr>
									</thead>
									<tbody>
										<tr class="even pointer" th:each="entity,entityStat : ${pageList}">
											<td th:text="${entity.id}"></td>
											<td th:text="${entity.account}"></td>
											<td th:text="${#dates.format(entity.firstTime, 'yyyy/MM/dd HH:mm:ss')}"></td>
											<td th:text="${entity.platform}"></td>
											<td th:text="${entity.loginCount}"></td>
										</tr>
									</tbody>
								</table>
							</div>
						</div>
						<div class="x_title">
							<div class="clearfix"></div>
						</div>
						<div class="x_content"></div>
					</div>
				</div>
				<div th:replace="fragments/page :: page"></div>
			</div>
			<!-- footer content -->
			<div th:replace="fragments/footer :: footer"></div>
		</div>
	</div>

	<div th:replace="fragments/dependency :: list-js"></div>

	<script type="text/javascript">
	var list = {
		baseUrl:"user",
		area:['60%','90%'],
		init : function() {
			$('button[name=query]').bind('click',function(){
				window.location.href=list.query();
			});
		},
		query : function() {
			pageFoot.searchUrl = '/'+list.baseUrl+'/list';
			var account = $("input[name=account]").val();
			var beginTime = $("input[name=beginTime]").val();
			var endTime = $("input[name=endTime]").val();
			var platform = $("select[name=platform]").val();
			return pageFoot.addParam("account", account).addParam("beginTime", beginTime).addParam("endTime", endTime).addParam("platform", platform).searchUrl;
		}
	}
	pageFoot.getCurrentUrl = function() {
		return list.query();
	}
	pageFoot.init();
	list.init();
	
	//开始时间控件初始化
	$('#myDatepicker0').datetimepicker({
		ignoreReadonly : true,
		allowInputToggle : true,
		format : 'YYYY/MM/DD'
	});
	//结束时间控件初始化
	$('#myDatepicker1').datetimepicker({
		ignoreReadonly : true,
		allowInputToggle : true,
		format : 'YYYY/MM/DD'
	});
</script>
</body>
</html>
